<template>
  <div class="box-tianhang">
    <!-- 开始日期 -->
    <el-button @click="addOne">{{ one.shijian }}</el-button>
    <div class="echarts-one">
      <One />
    </div>
    <div class="echarts-two">
      <Two />
    </div>
    <div class="echarts-three">
      <Three />
    </div>
  </div>
</template>
<script setup>
import useStore from "../store/index.js"
const { one } = useStore()
import zhCn from "element-plus/lib/locale/lang/zh-cn"
import { ref, onMounted } from "vue"
import One from "../view/Echarts/one.vue"
import Two from "../view/Echarts/two.vue"
import Three from "../view/Echarts/three.vue"
onMounted(() => {})
const addOne = () => {
  one.updateShijian()
}
const locale = ref(zhCn)
</script>
<style scoped lang="less">
.box-tianhang {
  width: 100%;
  height: 100%;
  .CSRQ {
    width: 300px;
    height: 50px;
    line-height: 50px;
    display: flex;
    align-items: center;
    position: relative;
    /deep/.el-input__wrapper {
      margin-left: 10px;
      border: 1px solid #5178ae;
      background-color: #e7eef3;
      .el-input__inner {
        text-align: center !important;
      }
    }
  }
  .echarts-one {
    width: 550px;
    height: 380px;
  }
  .echarts-two {
    width: 650px;
    height: 380px;
  }
  .echarts-three {
    position: absolute;
    left: 900px;
    top: 50px;
    width: 650px;
    height: 380px;
  }
}
</style>
